// 专门用来写页面性能监控的逻辑
const processData = (p) => {
  const data = {
    prevPage: p.fetchStart - p.navigationStart, // 上一个页面到这个页面的时长
    redirect: p.redirectEnd - p.redirectStart, // 重定向的时长
    dns: p.domainLookupEnd - p.domainLookupStart, // dns解析的时长
    connect: p.connectEnd - p.connectStart, // tcp连接的时长
    send: p.responseEnd - p.requestStart, // 请求到响应结束耗时
    ttfb: p.responseStart - p.navigationStart, // 首字节接受到的时长(从url栏敲回车开始计算)
    domready: p.domInteractive/*←dom加载完了(但还没准备好事件(domInteractive等同于domContentLoadedEventStart),domContentLoadedEventEnd时表示事件也准备好了,domComplete表示图片等资源也准备好了)*/ - p.domLoading, // dom准备的时长
    whiteScreen: p.domLoading/*←已经可以开始看到一点dom了*/ - p.navigationStart, //从敲回车到开始出现dom的时间
    dom: p.domComplete - p.domLoading,
    load: p.loadEventEnd - p.loadEventStart, // window.load里可能写了很多代码
    total: p.loadEventEnd - p.navigationStart
  };

  return data;
};

/**
 * 为了拿到performance.timing.loadEventEnd的准确时间
 * 必须等到window.load注册的事件都执行完
 * @param cb
 */
const load = (cb) => {
  let timer;
  const check = () => {
    if(performance.timing.loadEventEnd){
      clearTimeout(timer);
      cb()
    }else { /** 如果还处于timing里的onLoad阶段,即window.onload注册的事件还没执行完 performance.timing.loadEventEnd是为 0 的*/
      timer = setTimeout(check,100)
    }
  };
  window.addEventListener('load', check,false);
};


const domready = (cb) => {
  let timer;
  const check = () => {
    if(performance.timing.domInteractive){
      clearTimeout(timer);
      cb()
    }else {
      timer = setTimeout(check, 100)
    }
  };
  window.addEventListener('DOMContentLoaded', check,false);
};

export default {
  init(cb) {
    //有可能没有处罚onload dom解析完成后先统计一下 因为用户可能没有加载完就关闭了网页
    domready(()=>{
      const perfData = performance.timing;
      const data = processData(perfData);
      data.type = 'domready'; // ←不仅dom 连资源都加载完了 即彻底加载完毕
      cb(data);
    }),

    //不仅dom 连资源都加载完了 即彻底加载完毕
    load(() => {
      const perfData = performance.timing;
      const data = processData(perfData);
      data.type = 'loaded';
      cb(data);
    });
  }
}
